var xwrtSetStandart = function(el){
	if (el.getAttribute("height")!=""){ el.style.height=el.style.height || el.getAttribute("height")}
	if (el.getAttribute("width")!=""){ el.style.width=el.style.width || el.getAttribute("width")}
	el.style.position=el.style.position || "relative";
}
var xwrtContent = function(el){
	var that = this;
	var mainWidth = el.style.width || el.getAttribute("width") || false;
	var mainHeight= el.style.height || el.getAttribute("height") || false;
//	xwrtSetStandart(el);
	var myParent = el.parentNode;
	var myId = el.getAttribute("id") || "content_"+el.getAttribute("xWrtId");
	this.id = myId;
	this.el = el;
	var estilo = el.getAttribute("style");
	el.style.backgroundColor="#aabbcc";
	var region = el.getAttribute("region");

	this.resize = function (){
		if (mainWidth!==false) {
			that.el.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
//			el.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
		} else {
			that.el.style.width = free_width(that.el)+"px";
//			el.style.width = free_width(el)+"px";
		}
		if (mainHeight!==false){
			that.el.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
//			el.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
		} else {
			that.el.height = free_height(that.el)+"px";
//			el.height = free_height(el)+"px";
		}
//		that.el.innerHTML=that.el.clientHeight+mainHeight+" "+that.el.clientWidth+mainWidth;
	};
	var myEst="";
/*
	for(var est in estilo){
		myEst+="("+est+"="+estilo[est]+")";
	}
*/
/*
	el.innerHTML=el.innerHTML+el.clientHeight+mainHeight+" "+el.clientWidth+mainWidth+"\n"+
		" estilo: "+myEst;
*/
//	addEvent(window, "resize", that.resize);
}
var xwrtContent1 = function(el){
	var that = this;
	var mainWidth = el.style.width || el.getAttribute("width") || false;
	var mainHeight= el.style.height || el.getAttribute("height") || false;
	var myId = el.getAttribute("id") || "content_"+el.getAttribute("xWrtId");
	var myParent = el.parentNode;
	var estilo = el.getAttribute("style");
	var region = el.getAttribute("region");
//	xwrtSetStandart(el);
	this.id = myId;
	this.el = el;
	el.style.backgroundColor="#aabbcc";
/*
	this.resize = function (){
		if (mainWidth!==false) {
			that.el.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
//			el.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
		} else {
			that.el.style.width = free_width(that.el)+"px";
//			el.style.width = free_width(el)+"px";
		}
		if (mainHeight!==false){
			that.el.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
//			el.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
		} else {
			that.el.height = free_height(that.el)+"px";
//			el.height = free_height(el)+"px";
		}
//		that.el.innerHTML=that.el.clientHeight+mainHeight+" "+that.el.clientWidth+mainWidth;
	};
	var myEst="";
*/
/*
	for(var est in estilo){
		myEst+="("+est+"="+estilo[est]+")";
	}
*/
/*
	el.innerHTML=el.innerHTML+el.clientHeight+mainHeight+" "+el.clientWidth+mainWidth+"\n"+
		" estilo: "+myEst;
*/
//	addEvent(window, "resize", that.resize);
}
var xwrtLayout = function(el){
	var myParent = el.parentNode;
	var myId = el.getAttribute("id") || "layoutContainer_"+el.getAttribute("xWrtId");

	var main_div = el.cloneNode(true);
	myParent.replaceChild(main_div,el);

	var top_div = document.createElement("div");
	top_div.style.display="none";
//	var center_div = 	main_div.firstChild.cloneNode(true);
	var middle_div = document.createElement("div");
	middle_div.style.display="none";
	var bottom_div = document.createElement("div");
	bottom_div.style.display="none";
//	var layouts = main_div.getElementsByTagName("*");
	var layouts = main_div.getElementsByTagName("*");
	for(var i=0;i<layouts.length;i++){
		var str_region = layouts[i].getAttribute("region");
		var layoutId = layouts[i].getAttribute("id") || myId+"_layoutContainer_"+layouts[i].getAttribute("xWrtId");
		switch (str_region){
			case "top" :
				top_div = layouts[i];//.cloneNode(true);
				xwrtSetStandart(top_div);
				top_div.id = layoutId+"_top";
				layouts[i].parentNode.removeChild(layouts[i]);
				i--;
			break;
			case "center" : 
				middle_div = layouts[i];//.cloneNode(true);
				xwrtSetStandart(middle_div);
				layouts[i].parentNode.removeChild(layouts[i]);
				
				middle_div.id = layoutId+"_center";
				middle_div.style.overflow="auto";
				middle_div.style.position="relative";
				i--;
			break;
			case "bottom" : 
				bottom_div = layouts[i];//.cloneNode(true);
				layouts[i].parentNode.removeChild(layouts[i]);
				xwrtSetStandart(bottom_div);
				bottom_div.id = layoutId+"_bottom";
				bottom_div.style.position="absolute";
				bottom_div.style.bottom="0px";
				bottom_div.style.left="0px";
				i--;
			break;
		}
	}
	main_div.appendChild(top_div);
	main_div.appendChild(middle_div);
	main_div.appendChild(bottom_div);
/*
	var className = el.getAttribute("class");
*/
	var mainWidth = main_div.style.width || main_div.getAttribute("width") || false;
	var mainHeight= main_div.style.height || main_div.getAttribute("height") || false;
//	var waitdiv = loadingDataPopUp();

	this.resize = function (){
		var bodyOverflow = document.body.style.overflow;
		var parentOverflow = myParent.style.overflow;
		document.body.style.overflow="hidden";
		if (mainWidth!==false) {
			main_div.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
		} else {
			main_div.style.width = free_width(main_div)+"px";
		}
		if (mainHeight!==false){
			main_div.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
		} else {
			main_div.style.height = free_height(main_div)+"px";
		}
		main_div.style.minHeight = parseFloat(bottom_div.offsetHeight)+(top_div.offsetHeight)+22+"px";
		if(middle_div.hasChildNodes()){
			var childs = middle_div.getElementsByTagName("*");
			var chHeight=0;
			var chWidth=0;
			for(var i=0;i<childs.lenght;i++){
				chHeight+=childs[i].offsetHeight;
				chWidth+=childs[i].offsetWidth;
			}
			alert(chHeight+" - "+chWidth);
		}
		middle_div.style.width=parseFloat(free_width(middle_div))+"px";
		top_div.style.width=parseFloat(free_width(top_div))+"px";
		bottom_div.style.width=parseFloat(free_width(bottom_div))+"px";
		middle_div.style.height=parseFloat(free_height(middle_div))-bottom_div.offsetHeight-top_div.offsetHeight+"px";
		document.body.style.overflow=bodyOverflow;
		myParent.style.overflow=parentOverflow;
	}
	main_div.id = myId+"_main";
	main_div.style.position="relative";
//	el.style.overflow="hidden";
	main_div.style.backgroundColor="#ddeeff";
//top_div.style.border="1px solid blue";
//middle_div.style.border="1px solid red";
	bottom_div.style.border="1px solid green";
//top_div.style.display="none";
//bottom_div.style.display="none";
	this.resize();
	addEvent(window, "resize", this.resize);
}

var xwrtColumn = function(el){
	var myParent = el.parentNode;
	var myId = el.getAttribute("id") || "layoutCollumn_"+el.getAttribute("xWrtId");
	var myDiv = document.createElement("div");
	var main_div = el.cloneNode(true);
	myParent.replaceChild(main_div,el);
	
	var left_div = document.createElement("div");
	left_div.style.display="none";
	var center_div = document.createElement("div");
	center_div.style.display="none";
	var right_div = document.createElement("div");
	right_div.style.display="none";

	var layouts = main_div.getElementsByTagName("*");
	for(var i=0;i<layouts.length;i++){
		var str_region = layouts[i].getAttribute("region");
		switch (str_region){
			case "left" :
				left_div = layouts[i];//.cloneNode(true);
				xwrtSetStandart(left_div);
				left_div.style.margin="0";
				left_div.style.position="relative";
				left_div.style.cssFloat="left";
				left_div.style.styleFloat="left";
				layouts[i].parentNode.removeChild(layouts[i]);
				i--;
			break;
			case "center" : 
				center_div = layouts[i];//.cloneNode(true);
				center_div.id = myId+"_center";
				center_div.style.overflow="auto";
				center_div.style.position="relative";
				center_div.style.margin="0";
				center_div.style.cssFloat="left";
				center_div.style.styleFloat="left";
				layouts[i].parentNode.removeChild(layouts[i]);
				i--;
			break;
			case "right" : 
				right_div = layouts[i];//.cloneNode(true);
				xwrtSetStandart(right_div);
				right_div.id = myId+"_right";
				right_div.style.position="absolute";
				right_div.style.top="0";
				right_div.style.right="0";
				right_div.style.margin="0";
				right_div.style.cssFloat="right";
				right_div.style.styleFloat="right";
				layouts[i].parentNode.removeChild(layouts[i]);
				i--;
			break;
		}
	}
	main_div.appendChild(left_div);
	main_div.appendChild(center_div);
	main_div.appendChild(right_div);
	this.id=myId;
	var mainWidth = main_div.style.width || main_div.getAttribute("width") || false;
	var mainHeight= main_div.style.height || main_div.getAttribute("height") || false;

	this.resizeColumn = function (){
		var bodyOverflow = document.body.style.overflow;
		var parentOverflow = myParent.style.overflow;
		myParent.style.overflow="hidden";
		document.body.style.overflow="hidden";
		if (mainWidth!==false) {
			main_div.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
		} else {
			main_div.style.width = free_width(main_div)+"px";
		}
		if (mainHeight!==false){
			main_div.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
		} else {
			main_div.style.height = free_height(main_div)+"px";
		}
		
		main_div.style.minWidth = parseFloat(right_div.offsetWidth)+(left_div.offsetWidth)+22+"px";
		center_div.style.height=parseFloat(free_height(center_div))+"px";
		if(center_div.hasChildNodes()){
			var childs = center_div.getElementsByTagName("*");
			var chHeight=0;
			var chWidth=0;
			for(var i=0;i<childs.lenght;i++){
				chHeight+=childs[i].offsetHeight;
				chWidth+=childs[i].offsetWidth;
			}
			alert(chHeight+" - "+chWidth);
		}
		left_div.style.height=parseFloat(free_height(left_div))+"px";
		right_div.style.height=parseFloat(free_height(right_div))+"px";
		var centWidth = parseFloat(free_width(center_div))-(right_div.offsetWidth+left_div.offsetWidth);
		center_div.style.width=centWidth+"px";
		document.body.style.overflow=bodyOverflow;
		myParent.style.overflow=parentOverflow;
	}
	main_div.id = myId+"_columns";
	main_div.style.position="relative";
	left_div.id = myId+"_left";
main_div.style.backgroundColor="#ddeeff";
//right_div.style.border="1px solid green";
	this.resizeColumn();
	addEvent(window, "resize", this.resizeColumn);
}

function mycoso(el){
	this.Region = el.getAttribute("region") || false;
	this.Width = el.style.width 	|| el.getAttribute("width") 	|| false;
	this.Height= el.style.height 	|| el.getAttribute("height") 	|| false;
	el.style.position="relative";
	el.style.border="1px solid blue";
	el.style.backgroundColor="#FFEEDD";
};

//myBottom.prototype = new mycoso();
//myBottom.prototype.constructor = myBottom();
function myBottom(el){
	var that = this;
	this.El = el;
//	mycoso.call(this,el);
//	alert(el.id+" "+el.parentNode.id);
	this.Region = el.getAttribute("region") || false;
	this.Width = el.style.width 	|| el.getAttribute("width") 	|| false;
	this.Height= el.style.height 	|| el.getAttribute("height") 	|| false;
	el.style.border="1px solid blue";
	el.style.backgroundColor="#FFEEDD";
//	el.style.position="absolute";
//	el.style.bottom="0";
//	el.style.left="0";
	this.resize = function(){
//		alert("actual:"+that.El.id+"\npapa:"+that.El.parentNode.id+"\n"+free_width(that.El)+" "+that.El.clientWidth+" "+that.El.parentNode.parentNode.clientWidth);
/*
		if (that.Width!==false) {
			that.El.style.width = (isNumeric(that.Width)) ? that.Width+"px" : that.Width;
		} else {
			that.El.style.width = free_width(that.El)+"px";
		}
*/
//		alert("myBottom "+this.El.id+" "+this.El.parentNode.id);
//		alert("resize bottom el.id="+el.id);
	};
	this.resize();
//	el.parentNode.replaceChild(this.el,el);
	addEvent(that.El.parentNode,"resize",that.resize);
	addEvent(window,"resize",that.resize);
};
//myTop.prototype = new mycoso();
//myTop.prototype.constructor = myTop();
function myTop(el){
	var that = this;
	this.El=el;
//	mycoso.call(this,el);
	this.Region = el.getAttribute("region") || false;
	this.Width = el.style.width 	|| el.getAttribute("width") 	|| false;
	this.Height= el.style.height 	|| el.getAttribute("height") 	|| false;
	el.style.border="1px solid blue";
	el.style.backgroundColor="#FFEEDD";
	this.resize = function(){
//		alert("actual:"+that.El.id+"\npapa:"+that.El.parentNode.id+"\n"+free_width(that.El)+" "+that.El.clientWidth+" "+that.El.parentNode.parentNode.clientWidth);
		if (that.Width!==false) {
			that.El.style.width = (isNumeric(that.Width)) ? that.Width+"px" : that.Width;
		} else {
			that.El.style.width = free_width(that.El)+"px";
		}
//		alert("actual:"+that.El.id+"\npapa:"+that.El.parentNode.id+"\n"+free_width(that.El));
//		alert("resize center el.id="+el.id);
	};
//	this.resize();
//	el.parentNode.replaceChild(this.el,el);
//	addEvent(that.El.parentNode,"resize",that.resize);
//	addEvent(window,"resize",that.resize);
};

function myCenter(el){
	var that=this;
	this.El=el;
	this.Region = el.getAttribute("region") || false;
	this.Width  = el.style.width 	|| el.getAttribute("width") 	|| false;
	this.Height = el.style.height 	|| el.getAttribute("height") 	|| false;
	el.style.position="relative";
//	el.style.border="1px solid blue";
	el.style.backgroundColor="#FFEE88";
	this.resize = function(){
		var bro = that.El.parentNode.childNodes;
		var cWidth = free_width(that.El);
		var cHeight = free_height(that.El);
//		alert("hnos:"+bro.length+" actual:"+that.El.id+"\npapa:"+that.El.parentNode.id+"\n"+cWidth+" "+free_width(that.El));
//		alert(bro.length);
		for(var i=0;i<bro.length; i++){
			if(bro[i].getAttribute){
				if(that.El!=bro[i]){
					var str_region = bro[i].getAttribute("region");
					switch (str_region){
						case "top":
						case "bottom":
//							alert("hnos:"+bro.length+" actual:"+that.El.id+"\npapa:"+that.El.parentNode.id+" -hno:"+bro[i].id+"\n"+cWidth+" "+free_width(bro[i])+" "+free_width(that.El));
//							alert("Altura de "+that.El.id+":"+cHeight+"-"+used_height(bro[i])+" por "+bro[i].id+" "+bro[i].offsetHeight);
							cHeight-=bro[i].offsetHeight;
						break;
						case "left":
						case "right":
							cWidth-=bro[i].offsetWidth;
						break;
					}
				}else{
//					alert(myEl.id+" = "+bro[i].id);
				}
			}
		}
//		alert(free_width(that.El)+" "+cWidth+"\n"+free_height(that.El)+" "+cHeight);
//		that.El.style.width = cWidth+"px";
		that.El.style.height = cHeight+"px";
//		alert("resize center el.id="+el.id);
	};
	this.resize();
//	el.parentNode.replaceChild(this.El,el);
	addEvent(window,"resize",this.resize);
	addEvent(that.El.parentNode,"resize",that.resize);
};

var xwrtBottom = function(el){
	this.el = el.cloneNode(el);
	this.el.style.position="absolute";
	this.el.style.top="0px";
	this.el.style.bottom="0px";
}

var xwrtHorizontal = function(el){
	this.main_div = document.createElement("div");
	this.top_div = document.createElement("div");
	this.middle_div = document.createElement("div");
	this.bottom_div = new xwrtBottom(document.createElement("div"));

	this.main_div.appendChild(top_div);
	this.main_div.appendChild(middle_div);
	this.main_div.appendChild(bottom_div);
}

var xwrtRighColHorizontal = function(el){
	this.main_div = document.createElement("div");
	this.top_div = document.createElement("div");
	this.middle_div = document.createElement("div");
	this.bottom_div = new xwrtBottom(document.createElement("div"));

	this.main_div.appendChild(top_div);
	this.main_div.appendChild(middle_div);
	this.main_div.appendChild(bottom_div);
}

var xwrtVertical = function(){
	this.main_div = document.createElement("div");
	this.left_div = document.createElement("div");
	this.center_div = document.createElement("div");
	this.right_div = new xwrtRight(document.createElement("div"));
}
var xwrtPepe = function(el){
	var that = this;
	var xWrtType = el.getAttribute("xwrtType") || false;
	
	xwrtSetStandart(el);
	var myParent = el.parentNode;
	var myId = el.getAttribute("id") || "layoutContainer_"+el.getAttribute("xWrtId");
	var mainWidth = el.style.width || el.getAttribute("width") || false;
	var mainHeight= el.style.height || el.getAttribute("height") || false;
	var layouts = el.getElementsByTagName("*");

	var main_div = document.createElement("div");
	var top_div = document.createElement("div");
	top_div.style.display="none";

	var middle_div = document.createElement("div");
	middle_div.style.display="none";

	var bottom_div = document.createElement("div");
	bottom_div.style.display="none";


	for(var i=0;i<layouts.length;i++){
		var str_region = layouts[i].getAttribute("region");
		var str_xwrtType = layouts[i].getAttribute("xwrtType");
		var layoutId = layouts[i].getAttribute("id") || myId+"_layoutContainer_"+layouts[i].getAttribute("xWrtId");
		switch (str_region){
			case "top" :
				top_div = layouts[i];//.cloneNode(true);
				layouts[i].parentNode.removeChild(layouts[i]);
				xwrtSetStandart(top_div);
				prepareRegion(top_div);
				top_div.id = layoutId+"_top";
/*
				top_div.xwrtObj="layoutTop";
*/
				i--;
			break;
			case "center" : 
				middle_div = layouts[i];//.cloneNode(true);
				layouts[i].parentNode.removeChild(layouts[i]);
				xwrtSetStandart(middle_div);
				prepareRegion(middle_div);
				middle_div.id = layoutId+"_center";
/*
				middle_div.xwrtObj="layoutMiddle";
*/
				i--;
			break;
			case "bottom" : 
				bottom_div = layouts[i];//.cloneNode(true);
				layouts[i].parentNode.removeChild(layouts[i]);
				xwrtSetStandart(bottom_div);
				prepareRegion(bottom_div);
				bottom_div.id = layoutId+"_bottom";
/*
				bottom_div.xwrtObj="layoutBottom";
				bottom_div.style.position="absolute";
				bottom_div.style.overflow="auto";
				bottom_div.style.bottom="0px";
				bottom_div.style.left="0px";
*/
				i--;
			break;
		}
	}

//	if (el.xwrtObj){
//		main_div = el;//.cloneNode(true);
//	}else{
		main_div = el.cloneNode(true);
//	}
	xwrtSetStandart(main_div);
	prepareRegion(main_div);
//	if(el.xwrtObj){
		myParent.replaceChild(main_div,el);
//	}
	main_div.appendChild(top_div);
	main_div.appendChild(middle_div);
	main_div.appendChild(bottom_div);
/*
	if (mainWidth!==false) {
		main_div.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
	} else {
		main_div.style.width = free_width(main_div)+"px";
	}
	if (mainHeight!==false){
		main_div.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
	} else {
		main_div.style.height = free_height(main_div)+"px";
	}
*/
	main_div.resize = function (){
		if(main_div.parentNode.parentNode.resize) main_div.parentNode.parentNode.resize();
		var bodyOverflow = document.body.style.overflow;
		var parentOverflow = myParent.style.overflow;
		var mainOverflow=main_div.style.overflow;
//		myParent.style.overflow="hidden";
//		main_div.style.overflow="hidden";
		document.body.style.overflow="hidden";
		middle_div.style.minHeight=middle_div.style.fontSize;

		if (mainWidth!==false){
			main_div.style.width = (isNumeric(mainWidth)) ? mainWidth+"px" : mainWidth;
		} else {
			main_div.style.width = free_width(main_div)+"px";
		}
		if (mainHeight!==false){
			main_div.style.height = (isNumeric(mainHeight)) ? mainHeight+"px" : mainHeight;
		} else {
			main_div.style.height = free_height(main_div)+"px";
		}
		middle_div.style.height=parseFloat(free_height(middle_div))-bottom_div.offsetHeight-top_div.offsetHeight+"px";

//		main_div.setSize();
			if(top_div.setSize) top_div.setSize();
			if(bottom_div.setSize) bottom_div.setSize();
			if(middle_div.setSize) middle_div.setSize();
//		middle_div.style.width=parseFloat(free_width(middle_div))+"px";
//		that.main_div.style.minHeight=that.top_div.offsetHeight+that.bottom_div.offsetHeight+that.middle_div.style.minHeight+"px";
		document.body.style.overflow=bodyOverflow;
//		myParent.style.overflow=parentOverflow;
//		that.main_div.style.overflow=mainOverflow;
	};
//	this.main_div.id = this.myId+"_main";
//	this.main_div.style.position="relative";
	main_div.style.backgroundColor="#ddeeff";
	bottom_div.style.border="1px solid green";
	main_div.resize();
	addEvent(window,"resize", main_div.resize);
}

var regionSize = function(){
	var region=this.getAttribute("region");
	switch (region){
		case "top":
		case "bottom":
			this.dynWidth=false;
			this.style.backgroundColor="#ffbbcc";
			if(this.dynHeight!==false){
				this.style.height = (isNumeric(this.dynHeight)) ? this.dynHeight+"px" : this.dynHeight;
			}
			this.style.width = free_width(this)+"px";
		break;
		case "left":
		case "right":
			this.dynHeight=false;
			this.style.backgroundColor="#ccddee";
			if(this.dynWidth!==false){
				this.style.width = (isNumeric(this.dynWidth)) ? this.dynWidth+"px" : this.dynWidth;
			}
			this.style.height = free_height(this)+"px";
		break;
		case "center":
			this.style.backgroundColor="#ddeeff";
//			this.style.height = free_height(this);
//			this.style.width = free_width(this);
		break;
	}
	if (region && region!="center"){
		this.innerHTML=this.innerHTML+"<br>"+
		this.parentNode.parentNode.id+"-"+
		this.parentNode.id+"/"+this.id+" "+
		this.dynWidth+"/"+this.dynHeight+" "+
		this.clientWidth+" "+this.clientHeight+" "+
		this.offsetWidth+" "+this.offsetHeight;
	}
}

function prepareRegion(el){
	el.dynHeight=el.style.height || el.getAttribute("height") || false;
	el.dynWidth=el.style.width || el.getAttribute("width") || false;
	var region=el.getAttribute("region");
	switch (region){
		case "top":
		case "bottom":
			el.dynWidth=false;
			el.style.backgroundColor="#aabbcc";
			el.style.overflow="auto";
		break;
		case "left":
		case "right":
			el.dynHeight=false;
			el.style.backgroundColor="#ccddee";
		break;
		case "center":
			el.dynWidth=false;
			el.dynHeight=false;
			el.style.backgroundColor="#ddeeff";
			el.style.overflow="auto";
			el.style.position="relative";
		break;
	}
	el.setSize = regionSize;
}